<template>
  <div>
    <a-modal title="会签指标配置" :visible="visible" :confirm-loading="loading" ok-text="保存" @ok="ok" @cancel="cancel">
      <div class="about-master-container">
        <a-form-model ref="form" :model="queryParam" :rules="rules">
          <a-row>
            <a-col span="24">
              <a-form-model-item label="分类">
                <BaseInput v-model="queryParam.name" disabled />
              </a-form-model-item>
            </a-col>
            <a-col span="24">
              <a-form-model-item label="指标" prop="indexName">
                <BaseInput v-model="queryParam.indexName" placeholder="请输入" />
              </a-form-model-item>
            </a-col>
            <a-col span="24">
              <a-form-model-item label="责任人" prop="liableCode">
                <a-select v-model="queryParam.liableCode" placeholder="请选择">
                  <a-select-option v-for="i in selectList" :key="i.value" :value="i.value">{{ i.label }}</a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
          </a-row>
          <a-row>
            <a-col span="24">
              <a-form-model-item label="状态" prop="status">
                <a-select v-model="queryParam.status">
                  <a-select-option :value="0">可用</a-select-option>
                  <a-select-option :value="1">不可用</a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <a-col span="24">
              <a-form-model-item label="排序">
                <BaseInputNumber :min="0" isInt v-model="queryParam.sortNum" placeholder="请输入" />
              </a-form-model-item>
            </a-col>
          </a-row>
        </a-form-model>
      </div>
    </a-modal>
  </div>
</template>

<script>
import api from '@/api/technical/constructionStage.js'

export default {
  name: 'a' + Date.now(),
  props: {
    visible: {
      type: Boolean,
      required: true
    },
    form: {
      type: Object,
      default: () => null
    }
  },
  data() {
    return {
      loading: false,
      queryParam: { status: 0, parentName: '' },
      rules: {
        indexName: [{ required: true, message: '请输入名称', trigger: 'change' }],
        status: [{ required: true, message: '请选择状态', trigger: 'change' }],
        liableCode: [{ required: true, message: '请选择责任人', trigger: 'change' }]
      },
      selectList: [
        {
          label: '总工',
          value: 'PDLXMZG'
        },
        {
          label: '项目经理',
          value: 'PDLXMJL'
        },
        {
          label: '材料主管',
          value: 'PDMMCLZG'
        },
        {
          label: '技术主管',
          value: 'PDTMQMJSZG'
        },
        {
          label: '生产经理',
          value: 'PDLSCJL'
        },
        {
          label: '安全总监',
          value: 'PDLAQZJ'
        },
        {
          label: '商务经理',
          value: 'PDLSWJL'
        },
        {
          label: '质量总监',
          value: 'PMLZLJL'
        }
      ]
    }
  },
  watch: {
    visible(e) {
      if (e) {
        this.$nextTick(() => {
          this.queryParam = this.$clone(this.form)
          this.queryParam.sortNum = this.queryParam.sortNum || this.index
        })
      } else {
        this.queryParam = { status: 1, parentName: '' }
        this.$refs.form.clearValidate()
      }
    }
  },
  methods: {
    async ok() {
      this.$refs.form.validate(async (valid) => {
        if (valid) {
          this.loading = true
          let res
          let temp = this.$clone(this.queryParam)
          temp.liableName = this.selectList.filter((e) => e.value == temp.liableCode)[0].label
          console.log(temp)
          if (this.queryParam.id) {
            res = await api.editDetail(temp)
          } else {
            res = await api.addDetail(temp)
          }
          this.loading = false

          this.$noticeSuccess('成功')
          this.$emit('ok', temp)
          this.cancel()
        } else {
          this.$noticeWarning('请填写完整')
        }
      })
    },
    cancel() {
      this.$emit('update:visible', false)
    }
  }
}
</script>

<style lang="less" scoped></style>
